<template>
  <page-wrap stay-still need-login title="编辑简历" back hideTab>
    <view class="resume">
      <!-- <view class="resume-tips" v-if="cnt">您的简历有{{ cnt }}个优化项</view> -->
      <view class="top-card white">
        <view class="top-card-basic">
          <view class="left">
            <view class="info">
              <text class="name">{{ info.iname }}</text>
              <text class="edit" @click="handleEdit('basic')">编辑资料</text>
            </view>
            <view class="tag-list">
              <text class="tag-item">{{ info.sex }}</text>
              <text class="divider" v-if="rctypeList[info.rctypeId]"></text>
              <text class="tag-item" v-if="rctypeList[info.rctypeId]">{{
                rctypeList[info.rctypeId]
              }}</text>
              <text class="divider"></text>
              <text class="tag-item">{{ info.gznum }}年经验</text>
              <text class="divider"></text>
              <text class="tag-item">{{ info.City_p }}</text>
            </view>
            <view class="status">{{ handleStatus(info.resume_status) }}</view>
          </view>
          <view class="right">
            <view class="avatar-wrap">
              <image class="avatar" :src="info.pic"></image>
            </view>
          </view>
        </view>
        <view class="concat-bar">
          <view>
            <view class="concat-bar-item">
              <text class="top-icon phone"></text>
              <text>{{ info.shouji }}</text>
            </view>
            <view class="concat-bar-item">
              <text class="top-icon email"></text>
              <text>{{ info.email }}</text>
            </view>
          </view>
          <text class="complete">完整度：{{ complete || '100' }}%</text>
        </view>
      </view>
      <view class="fill white">
        <view class="fill-item u-border-bottom">
          <view class="title-bar">
            <view class="title-wrap">
              <text class="title">工作经历</text>
              <text class="required">必填</text>
            </view>
            <view class="add" @click="handleEdit('exp')"
              ><text class="add-icon"></text>添加</view
            >
          </view>
          <view
            class="info-list"
            v-if="info.personWorkArr && info.personWorkArr.length"
          >
            <view
              class="info-item"
              v-for="(item, index) in info.personWorkArr"
              :key="index"
              @click="handleEdit('exp', item)"
            >
              <view class="name-bar">
                <view class="name-wrap">
                  <text class="name-icon name-icon-enterprise"></text>
                  <text class="title">{{ item.company }}</text>
                  <text class="edit-icon"></text>
                </view>
              </view>
              <view class="time"
                >{{ item.startdate }} 至 {{ item.stopdate }}</view
              >
              <view class="detail">
                <view class="detail-title">{{ item.jtzw }}</view>
                <view class="detail-desc">{{
                  item.workdesc || '暂无描述'
                }}</view>
              </view>
            </view>
          </view>
          <view class="info-empty" v-else>暂无工作经历</view>
        </view>
        <view class="fill-item u-border-bottom">
          <view class="title-bar">
            <view class="title-wrap">
              <text class="title">教育背景</text>
              <text class="required">必填</text>
            </view>
            <view class="add" @click="handleEdit('edu')"
              ><text class="add-icon"></text>添加</view
            >
          </view>
          <view
            class="info-list"
            v-if="info.personEdusArr && info.personEdusArr.length"
          >
            <view
              class="info-item"
              v-for="(item, index) in info.personEdusArr"
              :key="index"
              @click="handleEdit('edu', item)"
            >
              <view class="name-bar">
                <view class="name-wrap">
                  <text class="name-icon name-icon-school"></text>
                  <text class="title">{{ item.school }}</text>
                  <text class="edit-icon"></text>
                </view>
              </view>
              <view class="time"
                >{{ item.startdate }} 至 {{ item.stopdate }}</view
              >
              <view class="detail">
                <view class="detail-title"
                  >{{ eduList.find((ele) => +ele.value === +item.eduId).label }}
                  |
                  {{ item.zye || '专业未填写' }}
                </view>
                <view class="detail-desc">{{ item.edus || '暂无描述' }}</view>
              </view>
            </view>
          </view>
          <view class="info-empty" v-else>暂无教育背景</view>
        </view>
        <view class="fill-item u-border-bottom">
          <view class="title-bar">
            <view class="title-wrap">
              <text class="title">项目经验</text>
            </view>
            <view class="add" @click="handleEdit('project')"
              ><text class="add-icon"></text>添加</view
            >
          </view>
          <view
            class="info-list"
            v-if="info.work_projectArr && info.work_projectArr.length"
          >
            <view
              class="info-item"
              v-for="(item, index) in info.work_projectArr"
              :key="index"
              @click="handleEdit('project', item)"
            >
              <view class="name-bar">
                <view class="name-wrap">
                  <text class="name-icon name-icon-project"></text>
                  <text class="title">{{ item.person_projectName }}</text>
                  <text class="edit-icon"></text>
                </view>
              </view>
              <view class="time"
                >{{ item.person_projectstartdate }} 至
                {{ item.person_projectstopdate }}</view
              >
              <view class="detail">
                <view class="detail-title">项目描述</view>
                <view class="detail-desc">{{
                  item.person_projectDesc || '暂无描述'
                }}</view>
              </view>
            </view>
          </view>
          <view class="info-empty" v-else>暂无项目经验</view>
        </view>
        <view class="fill-item u-border-bottom">
          <view class="title-bar">
            <view class="title-wrap">
              <text class="title">自我评价</text>
            </view>
            <text class="edit-icon" @click="handleEdit('eval')"></text>
          </view>
          <view class="info">
            <view class="detail">{{ info.Grzz_p }}</view>
          </view>
        </view>
        <view class="fill-item u-border-bottom">
          <view class="title-bar">
            <view class="title-wrap">
              <text class="title">个人证书</text>
            </view>
            <view class="add" @click="handleEdit('cer')"
              ><text class="add-icon"></text>添加</view
            >
          </view>
          <view
            class="info-list"
            v-if="info.personCerArr && info.personCerArr.length"
          >
            <view
              class="info-item"
              v-for="(item, index) in info.personCerArr"
              :key="index"
              @click="handleEdit('cer', item)"
            >
              <view class="name-bar">
                <view class="name-wrap">
                  <text class="name-icon name-icon-project"></text>
                  <text class="title">{{ item.CertName }}</text>
                  <text class="edit-icon"></text>
                </view>
              </view>
              <view class="time">{{ item.Years + '-' + item.Months }}</view>
            </view>
          </view>
          <view class="info-empty" v-else>暂未添加个人证书</view>
        </view>
        <view class="fill-item u-border-bottom">
          <view class="title-bar">
            <view class="title-wrap">
              <text class="title">技能特长</text>
            </view>
            <text class="edit-icon" @click="handleEdit('skill')"></text>
          </view>
          <view v-if="info.otherTc" class="info">
            <view class="detail">{{ info.otherTc }}</view>
          </view>
          <view v-else class="info-empty">暂未添加技能特长</view>
        </view>
        <view class="fill-item u-border-bottom">
          <view class="title-bar">
            <view class="title-wrap">
              <text class="title">培训经历</text>
            </view>
            <view class="add" @click="handleEdit('train')"
              ><text class="add-icon"></text>添加</view
            >
          </view>
          <view class="info-list" v-if="info.trainArr && info.trainArr.length">
            <view
              class="info-item"
              v-for="(item, index) in info.trainArr"
              :key="index"
              @click="handleEdit('train', item)"
            >
              <view class="name-bar">
                <view class="name-wrap">
                  <text class="name-icon name-icon-skill"></text>
                  <text class="title"
                    >{{ item.train_institution }} |
                    {{ item.train_cource }}</text
                  >
                  <text class="edit-icon"></text>
                </view>
              </view>
              <view class="time"
                >{{ item.train_startdate }} - {{ item.train_enddate }}</view
              >
              <view class="detail">
                <view class="detail-desc">{{
                  item.train_desc || '暂无描述'
                }}</view>
              </view>
            </view>
          </view>
          <view class="info-empty" v-else>暂无培训经历</view>
        </view>
        <view class="fill-item u-border-bottom">
          <view class="title-bar">
            <view class="title-wrap">
              <text class="title">校园经历</text>
            </view>
            <view class="add" @click="handleEdit('schoolExp')"
              ><text class="add-icon"></text>添加</view
            >
          </view>
          <view
            class="info-list"
            v-if="info.studentLeaderArr && info.studentLeaderArr.length"
          >
            <view
              class="info-item"
              v-for="(item, index) in info.studentLeaderArr"
              :key="index"
              @click="handleEdit('schoolExp', item)"
            >
              <view class="name-bar">
                <view class="name-wrap">
                  <text class="name-icon name-icon-skill"></text>
                  <text class="title"
                    >{{ item.person_studentLeaderjob }}
                    <!-- | 岗位名称空 -->
                  </text>
                  <text class="edit-icon"></text>
                </view>
              </view>
              <view class="time"
                >{{ item.person_studentLeaderstartdate }} -
                {{ item.person_studentLeaderstopdate }}</view
              >
              <view class="detail">
                <view class="detail-desc">{{
                  item.person_studentLeaderjobdesc || '暂无描述'
                }}</view>
              </view>
            </view>
          </view>
          <view class="info-empty" v-else>暂未添加校园经历</view>
        </view>
        <view class="fill-item u-border-bottom">
          <view class="title-bar">
            <view class="title-wrap">
              <text class="title">奖项荣誉</text>
            </view>
            <view class="add" @click="handleEdit('reward')"
              ><text class="add-icon"></text>添加</view
            >
          </view>
          <view class="info-list" v-if="info.awardArr && info.awardArr.length">
            <view
              class="info-item"
              v-for="(item, index) in info.awardArr"
              :key="index"
              @click="handleEdit('reward', item)"
            >
              <view class="name-bar">
                <view class="name-wrap">
                  <text class="name-icon name-icon-skill"></text>
                  <text class="title">{{ item.person_awardesc }}</text>
                  <text class="edit-icon"></text>
                </view>
              </view>
              <view class="time">{{ item.person_awardate }}</view>
              <!-- <view class="detail">
                <view class="detail-desc">{{
                  item.person_studentLeaderjobdesc || "暂无描述"
                }}</view>
              </view> -->
            </view>
          </view>
          <view class="info-empty" v-else>暂未添加奖项荣誉</view>
        </view>
      </view>
      <view class="update">简历最新更新时间：{{ info.updatetime }}</view>
      <view class="produce-btn">
        <view class="adjust" @click="clickAdjust">调整</view>
        <view class="preview" @click="createResume">预览</view>
      </view>
    </view>
  </page-wrap>
</template>

<script>
import { eduList, aimList } from '@/utils/data';
import {
  getResumeData,
  getPersonDetail,
  refreshResume,
  getResumeIntegrity
} from '@/api/index';
import {
  createResumeAttachment,
  getPersonResumeAttachment
} from '@/api/modules/resumeCreate';
import ShareMixin from '@/mixins/share';
export default {
  name: 'resume',
  mixins: [ShareMixin],
  data() {
    return {
      cnt: 0,
      eduList,
      aimList,
      rctypeList: {
        1: '社会人才',
        0: '学生'
      },
      info: {},
      showTop: false,
      complete: 0,
      personId: uni.getStorageSync('person-id').slice(2) || undefined,
      routeList: {
        basic: '/pagesSub/resume/basic/index',
        exp: '/pagesSub/resume/experience/index',
        edu: '/pagesSub/resume/education/index',
        project: '/pagesSub/resume/project/index',
        eval: '/pagesSub/resume/evaluation/index',
        skill: '/pagesSub/resume/skill/index',
        train: '/pagesSub/resume/train/index',
        cer: '/pagesSub/resume/certificate/index',
        schoolExp: '/pagesSub/resume/schoolExp/index',
        reward: '/pagesSub/resume/reward/index'
      },
      topBg: `url(${this.$imgBaseSelf}home/top_bg.png)`,
      sharePath: '/pagesSub/newResume/index'
    };
  },
  watch: {
    info: {
      handler(val) {
        if (val.Iname_p !== undefined) {
          let cnt = 0;
          if (!val.personEdusArr || !val.personEdusArr.length) cnt++;
          if (
            (!val.personWorkArr || !val.personWorkArr.length) &&
            !+val.rctypeId
          )
            cnt++;
          let keys = [
            'iname',
            'sex',
            'bday',
            'regionid',
            'hka',
            'rctypeId',
            'start_workdate',
            'shouji',
            'email'
          ];
          let basicNotComp = false;
          keys.forEach((ele) => {
            if (ele === 'start_workdate') {
              basicNotComp = +val.rctypeId && !val[ele];
            } else if (!val[ele]) {
              basicNotComp = true;
            }
          });
          if (basicNotComp) cnt++;
          this.cnt = cnt;
          getApp().globalData.resumeInfo = val;
        }
      },
      deep: true
    }
  },
  onPageSSubcroll(res) {
    this.showTop = res.scrollTop > 0;
  },
  onShow() {
    if (!this.personId) return;
    let tabBarList =
      getApp().globalData.loginStatus === 'company'
        ? getApp().globalData.companyTabs
        : getApp().globalData.personTabs;
    getApp().globalData.tabBarList = tabBarList;
    this.getResumeData();
    this.getPersonDetail();
    this.getResumeIntegrity();
  },
  mounted() {
    this.sharePath =
      '/pagesSub/resume/resumeDetail/index?personId=' + this.personId;
    this.shareQuery = 'personId=' + this.personId;
  },
  // onShareAppMessage() {
  //   return {
  //     title: this.$selfName,
  //     path: "/pagesSub/resume/resumeDetail/index?personId=" + this.personId,
  //   };
  // },
  // onShareTimeline() {
  //   return {
  //     title: this.$selfName,
  //     path: "/pagesSub/resume/resumeDetail/index?personId=" + this.personId,
  //   };
  // },
  methods: {
    // clickPreview() {
    //   // uni.showLoading({
    //   //   title: "简历正在生成",
    //   // });
    //   // setTimeout(() => {
    //   //   uni.hideLoading();
    //   //   uni.showToast({ icon: "none", title: "简历生成系统忙碌，请稍后再试" });
    //   // }, 5000);
    //   // uni.navigateTo({
    //   //   url: `/pagesSub/resume/resumeTemplate/resumeDetail/index`,
    //   // });
    //   uni.navigateBack({
    //     delta: 1,
    //   });
    // },
    createResume() {
      let param = {
        personId: this.personId,
        temId: '1',
        attName: null,
        attType: '1',
        attStatus: '2'
      };
      createResumeAttachment(param).then((res) => {
        if (+res.code === 200) {
          uni.showToast({ icon: 'none', title: '简历提交成功' });
          uni.showLoading({
            title: '简历正在更新',
            mask: true
          });
          this.startTime = new Date().getTime();
          this.getResumeTime();
        } else {
          uni.showToast({ icon: 'none', title: res.status_desc });
        }
      });
    },
    getResumeTime() {
      if (new Date().getTime() - this.startTime > 30 * 1000) {
        clearTimeout(this.timer);
        uni.showToast({ icon: 'none', title: '服务器繁忙，请稍后重试' });
        return;
      }
      // 3s一次, 轮询中
      this.timer = setTimeout(() => {
        this.getResume(); // 调用轮询
      }, 2000);
    },
    getResume() {
      let param = {
        personId: this.personId,
        temId: '1'
      };
      getPersonResumeAttachment(param)
        .then((res) => {
          if (res && res.data.attPic) {
            console.log('成功了');
            uni.hideLoading();
            clearTimeout(this.timer);
            uni.navigateTo({
              url: `/pagesSub/resume/resumeTemplate/resumeDetail/index?id=${
                res.data.id
              }&attPic=${encodeURIComponent(res.data.attPic)}`
            });
          } else {
            clearTimeout(this.timer);
            // 没成功,调用轮询
            this.getResumeTime();
          }
        })
        .catch((err) => {
          // 请求错误,也继续轮询
          this.getResumeTime();
        });
    },
    clickAdjust() {
      uni.navigateTo({
        url: `/pagesSub/resume/resumeTemplate/resumeDetail/editResumeModule`
      });
    },
    handleStatus(val) {
      let status = aimList.find((ele) => +ele.value === +val);
      return status ? status.label : '';
    },
    getResumeData() {
      let param = {
        personId: this.personId,
        conditionArr: JSON.stringify({
          is_mp: 1
        })
      };
      getResumeData(param).then((res) => {
        let data = res.data || res;
        this.info = { ...this.info, ...data };
        getApp().globalData.userInfo = this.info;
      });
    },
    getResumeIntegrity() {
      let params = {
        personid: this.personId,
        conditionArr: ''
      };
      getResumeIntegrity(params).then((res) => {
        this.complete = res.info.resumeIntegrity;
      });
    },
    getPersonDetail(update) {
      if (
        !getApp().globalData.userInfo ||
        !getApp().globalData.userInfo.id ||
        update
      ) {
        let param = {
          param: JSON.stringify({
            personId: this.personId
          }),
          where: '',
          slaveInfo: 1
        };
        getPersonDetail(param).then((res) => {
          let data = res.data || res;
          if (
            data.pic &&
            data.pic.indexOf('img.job1001.com/myUpload/pic.gif') >= 0
          ) {
            data.pic = this.$defalutAvatar;
          }
          this.info = { ...this.info, ...data };
          getApp().globalData.userInfo = this.info;
        });
      } else {
        this.info = { ...this.info, ...getApp().globalData.userInfo };
        getApp().globalData.userInfo = this.info;
      }
    },
    handleEdit(key, item) {
      let route = this.routeList[key];
      if (item) {
        if (key == 'project') {
          route += `?id=${item.person_projectId}`;
        } else if (key == 'edu') {
          route += `?id=${item.edusId}`;
        } else if (key == 'exp') {
          route += `?id=${item.workId}`;
        } else if (key == 'train') {
          route += `?id=${item.train_id}`;
        } else if (key == 'cer') {
          route += `?id=${item.id}`;
        } else if (key == 'schoolExp') {
          // TODO:
          route += `?id=${item.person_studengLeaderId}`;
        } else if (key == 'reward') {
          // TODO:
          route += `?id=${item.person_awardId}`;
        }
      }
      uni.navigateTo({
        url: route
      });
    }
  }
};
</script>

<style lang="scss">
$img-base-resume: $img-base + 'resume/';
@include img-base-self('.king-kong .k-icon-aim', 'resume/aim.png?v=1');
@include img-base-self('.king-kong .k-icon-refresh', 'resume/refresh.png?v=1');
@include img-base-self('.king-kong .k-icon-preview', 'resume/preview.png?v=1');
@include img-base-self('.king-kong .k-icon-annex', 'resume/annex.png');
.resume {
  background-color: $uni-bg-color-grey;
  color: $uni-text-color-333;
  position: relative;
  padding-bottom: calc(42rpx + constant(safe-area-inset-bottom));
  padding-bottom: calc(42rpx + env(safe-area-inset-bottom));
  .white {
    background-color: $uni-bg-color;
    padding: 32rpx;
  }
  .top-icon {
    display: inline-block;
    margin-right: 16rpx;
    width: 44rpx;
    height: 44rpx;
    background-size: 100% 100%;
    vertical-align: middle;
    &.phone {
      background-image: url($img-base-resume + 'phone.png');
    }
    &.email {
      background-image: url($img-base-resume + 'mail.png');
    }
  }
  .resume-tips {
    margin: 32rpx;
    padding: 16rpx 0;
    background: #fff3e1;
    color: #f86e21;
    border-radius: 16rpx;
    font-size: $uni-font-size-base;
    text-align: center;
  }
  .top-card {
    margin: 32rpx 32rpx 0 32rpx;
    border-radius: 10rpx;
    &-basic {
      display: flex;
      justify-content: space-between;
      margin-top: 24rpx;
      .info {
        display: flex;
        align-items: center;
        .name {
          margin-right: 16rpx;
          font-size: $uni-font-size-max;
          font-weight: bold;
          color: $uni-text-color-222;
          letter-spacing: 2rpx;
        }
        .edit {
          font-size: 24rpx;
          color: #ff4928;
          background-color: #f5f5f5;
          padding: 8rpx 28rpx;
          display: inline-block;
          border-radius: 20rpx;
        }
      }
      .avatar-wrap {
        display: inline-block;
        padding: 6rpx;
        border-radius: 50%;
        background: linear-gradient(
          135deg,
          rgba(255, 212, 128, 1),
          rgba(255, 95, 55, 1)
        );
      }
      .avatar {
        width: 120rpx;
        height: 120rpx;
        border-radius: 50%;
        // border: 1px solid #cccccc;
      }
      .tag-list {
        margin: 18rpx 0 18rpx 0;
        color: $uni-text-color-333;
        font-size: $uni-font-size-base;
      }
      .status {
        font-size: $uni-font-size-base;
        color: $uni-text-color-999;
      }
      .divider {
        display: inline-block;
        width: 1px;
        height: 24rpx;
        vertical-align: middle;
        background-color: $uni-text-color-grey;
        margin: 0 12rpx;
      }
    }
    .concat-bar {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin: 24rpx 0;
      &-item {
        margin-top: 14rpx;
        font-size: $uni-font-size-base;
      }
      .complete {
        padding: 18rpx 32rpx;
        margin-right: -32rpx;
        background-color: $uni-bg-color-disable;
        border-radius: 32rpx 0 0 32rpx;
        font-size: $uni-font-size-nor;
        line-height: $uni-font-size-base;
        color: $uni-text-color-error;
      }
    }
  }
  .king-kong {
    display: flex;
    align-items: center;
    justify-content: space-around;
    margin: 24rpx 32rpx;
    border-radius: 24rpx;
    text-align: center;
    font-size: $uni-font-size-nor;
    color: $uni-text-color-333;
    &-item {
      .k-icon {
        display: block;
        margin: 0 auto;
        margin-bottom: 8rpx;
        width: 88rpx;
        height: 88rpx;
        background-size: 100% 100%;
        background-color: #fff;
        border-radius: 50%;
      }
    }
  }
  .fill {
    padding: 0;
    border-radius: 10rpx;
    &-item {
      padding: 32rpx 32rpx 0rpx 32rpx;
      // border-bottom: 16rpx solid $uni-bg-color-grey;
      .title-bar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        .title-wrap {
          display: flex;
          align-items: center;
        }
        .title {
          font-size: $uni-font-size-lg;
          font-weight: bold;
          color: $uni-text-color-333;
        }
        .required {
          margin-left: 16rpx;
          padding: 0rpx 2rpx;
          color: $uni-text-color-error;
          border: 1px solid $uni-border-color-red;
          border-radius: 8rpx;
          font-size: $uni-font-size-sm;
          line-height: $uni-font-size-nor;
        }
        .add {
          display: flex;
          align-items: center;
          color: $u-type-primary;
          font-size: $uni-font-size-sm;
          &-icon {
            display: inline-block;
            vertical-align: middle;
            width: 27rpx;
            height: 27rpx;
            margin-right: 12rpx;
            background-image: url($img-base-resume + 'add.png?v=1');
            background-size: 100% 100%;
          }
        }
      }
      .info-list {
        margin-top: 24rpx;
        .info-item {
          padding-bottom: 32rpx;
          .name-bar {
            display: flex;
            align-items: center;
            justify-content: space-between;
            .name-wrap {
              display: flex;
              align-items: center;
              width: 100%;
            }
            .title {
              font-weight: bold;
              font-size: $uni-font-size-base;
              color: $uni-text-color-333;
              overflow: hidden;
              flex: 1;
              white-space: nowrap;
              text-overflow: ellipsis;
            }
            .name-icon {
              margin-right: 12rpx;
              width: 36rpx;
              height: 36rpx;
              background-size: 100% 100%;
              &-enterprise {
                background-image: url($img-base-resume + 'enterprise.png?v=1');
              }
              &-school {
                background-image: url($img-base-resume + 'school.png?v=1');
              }
              &-project {
                background-image: url($img-base-resume + 'project.png?v=1');
              }
              &-skill {
                background-image: url($img-base-resume + 'skill.png');
              }
            }
          }
          .time {
            margin-top: 16rpx;
            font-size: $uni-font-size-sm;
            color: $uni-text-color-999;
          }
        }
      }
      .info-empty {
        padding: 16rpx 0;
        text-align: center;
        color: $uni-text-color-555;
        font-size: $uni-font-size-nor;
      }
      .info {
        margin-top: 24rpx;
        padding-bottom: 32rpx;
      }
      .edit-icon {
        width: 48rpx;
        height: 48rpx;
        background-image: url($img-base-resume + 'edit.png?v=1');
        background-size: 100% 100%;
      }
      .detail {
        margin-top: 24rpx;
        color: $uni-text-color-999;
        font-size: $uni-font-size-sm;
        line-height: 48rpx;
        word-break: break-all;
        &-title {
          color: $uni-text-color-333;
          text-shadow: 0 0 0;
          line-height: normal;
        }
        &-desc {
          margin-top: 24rpx;
          line-height: 38rpx;
          overflow: hidden;
          text-overflow: ellipsis;
          display: -webkit-box;
          -webkit-line-clamp: 2;
          -webkit-box-orient: vertical;
        }
      }
    }
  }
  .update {
    padding: 40rpx 0 32rpx 0;
    text-align: center;
    color: #b3b3b3;
    font-size: $uni-font-size-sm;
  }
  .produce-btn {
    width: 100%;
    display: flex;
    justify-content: space-around;
    padding: 0 32rpx;
    position: fixed;
    bottom: 0rpx;
    font-size: 20px;
    padding-bottom: calc(2rpx + constant(safe-area-inset-bottom));
    padding-bottom: calc(2rpx + env(safe-area-inset-bottom));
    .adjust {
      width: 240rpx;
      text-align: center;
      padding: 20rpx 0rpx;
      margin-bottom: 50rpx;
      background: rgba(212, 212, 212, 0.8);
      border-radius: 5rpx;
    }
    .preview {
      flex: 1;
      text-align: center;
      padding: 20rpx 80rpx;
      margin-left: 32rpx;
      margin-bottom: 50rpx;
      background: #ec7f8d;
      color: #fff;
      border-radius: 5rpx;
    }
  }
}
</style>
